<template>
    <div class="box">
        <Head text="英雄列表" />
        <div>
            <ul>
                <router-link v-for="(value,index) in school"
                :key="index" 
                :to="{name:'RoleDetail',params:{data:value}}"
                tag="li">
                <img :src="value.roleThumbnail" alt="">
                <p>{{value.roleName}}</p>
                </router-link>
            </ul>
        </div>
    </div>
</template>

<script>
import Head from "@/components/Head.vue"

export default({
    name:"RoleList",
    components: {
        Head
    },
    data() {
        return {
            school:[],
        };
    },
    created () {
        this.ajax.get("http://api.aulence.com/mydata/roles/role-info.php?goodsID=12").then(res=>{
            this.school=res.data;
            // console.log(this.school);
        }).catch(res=>{
            console.log("获取失败",res);
        })
    }
})
</script>

<style lang="scss" scoped>
    @import "./RoleList.scss";
</style>